import {Form, Input, Button, Checkbox,message} from 'antd';
import {withRouter} from 'react-router-dom'
import {useDispatch} from 'react-redux'
import http from "src/request/request"

const Demo = (props) => {
    // 获取redux的dispatch分发函数
    const dispatch = useDispatch()

    const onFinish = (values) => {
        // console.log(import.meta.env,"env用的什么")
        // dispatch({type:"loginFunc",payload:{id:"151651360",name:"管理员",}})
        // message.success("登录成功")
        // props.history.push("/")
        http.login(values).then(res=>{
            if(res.status===200){
                console.log(res.data,"返回了什么")
                dispatch({type:"loginFunc",payload:{id:"151651360",name:"管理员",}})
                message.success("登录成功")
                props.history.push("/")
            }else{
                message.success(res.data.msg || "账号密码错误")
            }
        })
    };

    const onFinishFailed = (errorInfo) => {
        console.log('Failed:', errorInfo);
    };
    const labelcol = 8
    const wrappercol = 16
    return (
        <Form
            name="basic"
            labelCol={{
                span: labelcol,
            }}
            wrapperCol={{
                span: wrappercol,
            }}
            initialValues={{
                remember: true,
            }}
            onFinish={onFinish}
            onFinishFailed={onFinishFailed}
            autoComplete="off"
        >
            <Form.Item
                label="账号"
                name="username"
                rules={[
                    {
                        required: true,
                        message: '请输入账号!',
                    },
                ]}
            >
                <Input/>
            </Form.Item>

            <Form.Item
                label="密码"
                name="password"
                rules={[
                    {
                        required: true,
                        message: '请输入密码!',
                    },
                ]}
            >
                <Input.Password/>
            </Form.Item>

            <Form.Item
                name="remember"
                valuePropName="checked"
                wrapperCol={{
                    offset: labelcol,
                    span: wrappercol,
                }}
            >
                <Checkbox>记住账号</Checkbox>
            </Form.Item>

            <div className="w-full juzhong">
                <Button type="primary" htmlType="submit" ghost>
                    Submit
                </Button>
            </div>


        </Form>
    );
};

export default withRouter(Demo)